<template>
    <el-divider></el-divider>
    <el-table :data="tableData" :header-cell-style="{ background: '#FFFFFF', color: '#000000' }" stripe style="width: 100%">
        <el-table-column
        v-for="header in data.tableHeader"
        :key="header.prop"
        :prop="header.prop"
        :label="header.label"></el-table-column>
    </el-table>
</template>

<script>
import { reactive } from "vue"

export default {

    props: {
        tableColumns: {
            type: Array,
            default: () => ([])
        }
    },
    setup(props) {
        const data = reactive({
            tableData: [],
            tableHeader: props.tableColumns
        })

        return {
            data
        }
    }

}
</script>

<style lang="scss" scoped></style>